<template>
  <div class="promotion-container">
    <basic-container>
      <avue-crud :option="option" :table-loading="loading" :data="data" :page.sync="page" ref="crud" @on-load="getList"
        @current-change="currentChange" @size-change="sizeChange">
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
import { getPromoterList } from "../api";

export default {
  data () {
    return {
      userId: null,
      loading: false,
      data: [],
      page: {
        currentPage: 1,
        pageSize: 10,
        total: 0,
      },
      option: {
        menu: false,
        height: "auto",
        calcHeight: 30,
        tip: false,
        searchShow: false,
        border: false,
        index: true,
        indexLabel: '序号',
        addBtn: false,
        column: [
          {
            label: '推广成员',
            prop: 'nickname',
            width: 200,
            align: 'center'
          },
          {
            label: '产生推广费',
            prop: 'promotion_fee',
            width: 150,
            align: 'center',
            formatter: (row) => {
              return `¥${row.promotion_fee || '0.00'}`;
            }
          },
          {
            label: '关联时间',
            prop: 'created_at',
            width: 200,
            align: 'center'
          }
        ]
      }
    };
  },
  created () {
    // 从路由参数获取用户ID
    this.userId = this.$route.query.id;
    // if (this.userId) {
    //   this.getList();
    // }
  },
  methods: {
    getList () {
      this.loading = true;
      getPromoterList({ id: this.userId })
        .then((res) => {
          if (res.err === 0) {
            this.data = res.data || [];
            this.page.total = res.data ? res.data.length : 0;
          } else {
            this.$message.error(res.msg || '获取推广列表失败');
          }
        })
        .catch((error) => {
          this.$message.error('获取推广列表失败');
        })
        .finally(() => {
          this.loading = false;
        });
    },
    currentChange (currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange (pageSize) {
      this.page.pageSize = pageSize;
    }
  }
};
</script>

<style lang="scss" scoped>
.promotion-container {
  padding: 10px;
}
</style>
